<?php
$login_user = $this->muser->getLogin();
$name = ($login_user['use_name']) ? $login_user['use_name'] : $login_user['use_account'];

$this->template->add_js_lib("jquery.fileupload.js");
$this->template->add_js_lib("jquery.iframe-transport.js");
$this->template->add_css_lib("jquery.fileupload.css");
$this->template->add_css_lib("jquery.fileupload-ui.css");
echo $this->template->add_css("user-edit-profile.css");
?>

<div id="fgpage">
	<div id="content" style="width:680px; float:left">
		<h1><span>Thông tin tài khoản</span></h1>
		<div class="clear" style="height:10px">
		</div>
		<div class="wpuf-profile">
            <form name="profile" id="your-profile" action="" method="post">
				<div class="wpuf-userinfo">
					<div class="wpuf-userinfo-head">
						<div class="wpuf-userinfo-left">
							<div class="wpuf-userinfo-avatar">
								<img src="<?php echo image_thumbnail($user->use_avatar,'user-avatar-medium'); ?>" alt="" class="avatar avatar-124  photo user-1-avatar" width="124" height="124" id="user-avatar">
							</div>
							<div class="wpuf-userinfo-username"><?php echo $login_user['use_account']; ?>
							</div>
						
					<span class="btn btn-success fileinput-button edit-avatar" id="user-avatar-link">
						<input id="fileupload" type="file" name="files">
					</span>
						</div>
						<!-- The global progress bar -->
   
						<div class="wpuf-userinfo-right">
							<div><span>Cấp độ:</span><?php echo @$trophy;?></div>
							<div><span>Điểm kinh nghiệm:</span> <?php echo @$user->use_scores;?></div>
							<div><span>Hạng:</span> <?php echo @$user->use_rank;?></div>
							<div><span>Điểm kinh nghiệm bạn đã tích lũy thêm trong hôm nay:</span> <?php echo $score_today;?></div>
						</div>
					</div>
					<div class="wpuf-userinfo-basic">	
					
				<div id="progress" class="progress">
				<div class="progress-bar progress-bar-success"></div>
				</div>

						<div class="wpuf-userinfo-title">Thông tin cơ bản</div>
						<div class="wpuf-userinfo-basic-left">

							<div>
								<div>
									<span class="label">Mật khẩu:</span>
									<span class="text" id="text_passwd">****** </span> <input type="password" value="" class="editbox hide" id="input_passwd" autocomplete="off" style="display: none;">
								</div>
								<a href="javascript:void(0);" class="wpuf-userinfo-edit" id="passwd"></a>
							</div>

							<div class="wpuf-userinfo-no-background">
								<div><span class="label">Email:</span> 
									<span class="text"><?php echo @$login_user['use_email']; ?> </span>

								</div>
							</div>
							<div>
								<div>
									<span class="label">Họ tên của bạn:</span>
									<span class="text" id="text_fullname"> <?php echo @$user->use_name;?></span>
									<input type="text" value="<?php echo @$user->use_name;?>" class="editbox hide" id="input_fullname" style="display: none;">
								</div><a href="javascript:void(0);" class="wpuf-userinfo-edit" id="fullname"></a>
							</div>
							<div>
								<div>
									<span class="label">Công việc:</span> 
									<span class="text" id="text_job"><?php echo @$user->use_job;?></span>
									<input type="text" value="<?php echo @$user->use_job;?>" class="editbox hide" id="input_job" style="display: none;">
								</div>
								<a href="javascript:void(0);" class="wpuf-userinfo-edit" id="job"></a>
							</div>
							<div>
								<div>
									<span class="label">Sở thích:</span> <span class="text" id="text_preference"> <?php echo @$user->use_preference;?></span> <input type="text" value="<?php echo @$user->use_preference;?>" class="editbox hide" id="input_preference" style="display: none;">
								</div>
								<a href="javascript:void(0);" class="wpuf-userinfo-edit" id="preference"></a>
							</div>
						</div>
						<div class="wpuf-userinfo-title">Thông tin liên hệ</div>
						<div class="wpuf-userinfo-basic-left">
							<div>
								<div>
									<span class="label">Điện thoại:</span>
									<span class="text" id="text_phone"> <?php echo @$user->use_phone;?></span> <input type="text" value="<?php echo @$user->use_phone;?>" class="editbox hide" id="input_phone" style="display: none;">
								</div><a href="javascript:void(0);" class="wpuf-userinfo-edit" id="phone"></a>
							</div>
							<div>
								<div>
									<span class="label">Địa chỉ:</span>
									<span class="text" id="text_addr"> <?php echo @$user->use_address;?></span> 
									<input type="text" value="<?php echo @$user->use_address;?>" class="editbox hide" id="input_addr" style="display: none;">
								</div><a href="javascript:void(0);" class="wpuf-userinfo-edit" id="addr"></a>
							</div>
							<div>
								<div>
									<span class="label">Thành phố:</span> 
									<span class="text" id="text_city"> <?php echo @$user->use_city;?></span>
									<input type="text" value="<?php echo @$user->use_city;?>" class="editbox hide" id="input_city" style="display: none;">
								</div>
								<a href="javascript:void(0);" class="wpuf-userinfo-edit" id="city"></a>
							</div>
						</div>
					</div>


				</div>
			</form>
		</div>
	</div>
	<script>
		input_id = '';
		jQuery(function($) {
			$(".wpuf-userinfo-edit").click(function() {
				input_id = $(this).attr("id");
				$("#input_" + input_id).show();
				$("#text_" + input_id).hide();
				return false;
			});
			$(".1edit-avatar").click(function() {
				//alert("Edit avatar Clicked");
				//return false;
			});
			$(".editbox").mouseup(function() {
				return false
			});
			$(document).mouseup(function()
			{
				if ( $(".editbox").is(":visible") ) {
				$(".editbox").hide();
				if (input_id == 'passwd') {
					$("#text_" + input_id).text('******');
				}
				else {
					$("#text_" + input_id).text($("#input_" + input_id).val());
				}

				jQuery.ajax({
					type: "POST",
					url: "<?php echo base_url();?>ajax/chang-info.html",
					data: "action=updateUserInfo&type=" + input_id + "&data=" + $("#input_" + input_id).val(),
					success: function(data) {
						if (input_id == 'passwd' && $("#input_" + input_id).val() != '') {
							//window.location.href = "<?php echo base_url();?>";
						}
						else {
							$("#text_" + input_id).text(data);
						}
					}
				});
				$(".text").show();
				}
			});

		});
	</script>
</div>
 
  
	<script>
/*jslint unparam: true */
/*global window, $ */
$(function () {
    'use strict';
    // Change this to the location of your server-side upload handler:
    var url ='<?php echo base_url();?>user/do_upload';
    $('#fileupload').fileupload({
        url: url,
        dataType: 'json',
        done: function (e, data) {
		if(data.result.error == true){
			alert(data.result.message);
		}
		else {
		$.each(data.result.files, function (index, file) {
                $('#user-avatar').attr("src",file.url);
         });
			 $('#progress').css('visibility','hidden');
			 $('#progress .progress-bar').css('width','0%');
			 $('#progress').css('height','0px');
		 }
        },
		add: function (e, data) {
         $('#progress').css('visibility','visible');
		 $('#progress').css('height','20px');
		 data.submit();
		},
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('#progress .progress-bar').css(
                'width',
                progress + '%'
            );
        }
    }).prop('disabled', !$.support.fileInput)
        .parent().addClass($.support.fileInput ? undefined : 'disabled');
});
</script>